//
//  MagicImageView.swift
//  FreeWallpaperSwiftUI
//
//  Created by 张少康 on 2023/11/29.
//

import SwiftUI
import Kingfisher

struct MagicImageView: View {
    
    @Binding var showMagicView: Bool
        
    @State var magicImage: String = ""
    
    @State var starMagic: Bool = false
    
    @State var imageId: Int = 0
    
    var allImageModel: [WallpaperItemModel]
    
    var body: some View {
        ZStack {
            Color.clear.edgesIgnoringSafeArea(.all)
            
            
            ScrollView {
                
                VStack(spacing: 24){
                    Text("Magic show")
                        .font(Font.custom("Magefin Black", size: 35))
                        .foregroundColor(.black)
                    
                    ZStack {
                        RoundedRectangle(cornerRadius: 12)
                        if !magicImage.isEmpty {
                            KFImage(URL(string: magicImage))
                                .resizable()
                                .fade(duration: 0.25)
                                .onProgress { receivedSize, totalSize in
                                }
                                .onSuccess { result in
                                    
                                }
                                .onFailure { error in
                                    
                                }
                                .aspectRatio(1, contentMode: .fill)
                                .clipped()
                                .mask(RoundedRectangle(cornerRadius: 12))
                                .id(imageId)
                        }
                        if self.starMagic {
                            CustomLoadingView()
                        }
                        
                    }.frame(maxWidth: .infinity)
                        .aspectRatio(1, contentMode: .fill)
                        .shadow(color: .black, radius: 10)
                        .padding()
                    
                    Button(action: {
                        starMagicImage()
                    }, label: {
                        Text("Magic")
                            .foregroundColor(.white)
                            .font(Font.custom("BlackOpsOne-Regular", size: 25))
                            .frame(maxWidth: .infinity)
                            .padding(.vertical,12)
                    }).background(.blue)
                        .mask(RoundedRectangle(cornerRadius: 10))
                        .padding()
                    
                }
            }
            
            Button(action: {
                showMagicView.toggle()
            }, label: {
                Image(systemName: "xmark")
                    .font(.body.weight(.bold))
                    .foregroundColor(.secondary)
                    .padding(8)
                    .background(.ultraThickMaterial, in: Circle())
            }).frame(maxWidth: .infinity,maxHeight: .infinity, alignment: .topTrailing)
                .padding(.trailing,20)
            
        }
        .background(.ultraThinMaterial,ignoresSafeAreaEdges: .all)
        .onAppear {
            starMagicImage()
        }
            

    }
    
    func starMagicImage() {

        Task {
            self.starMagic = true
            self.imageId += 1
            self.magicImage = ""
            do {
                try await Task.sleep(nanoseconds: 2_000_000_000)
                self.starMagic = false
            }catch {
                self.starMagic = false
            }
            
            withAnimation(.bouncy(duration: 0.25)) {
                let randomModel = allImageModel.randomElement()
                let imageUrl = randomModel?.url ?? ""
                self.magicImage = "https://cn.bing.com" + imageUrl
            }
        }
    }
}


struct CustomLoadingView: View {
    
    @State var isAnimating: Bool = false

    var body: some View {
            Circle()
            .trim(from: 0, to: 0.7)
                .stroke(Color.blue, lineWidth: 3)
                .frame(width: 22, height: 22)
                .rotationEffect(.degrees(isAnimating ? 360 : 0))
                .animation(.linear(duration: 1.0).repeatForever(autoreverses: false), value: isAnimating)
                .onAppear {
                    self.isAnimating = true
                }
        }
}

#Preview {
    MagicImageView(showMagicView: .constant(true), allImageModel: [])
}
